{AJAXCONTENT}
<link rel="stylesheet" type="text/css" href="skins/default/css/Menu/style.css">

<table border="0" align="center" cellpadding="8" cellspacing="" width="100%" height="" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR}" valign="top">		
	<tr align="justify">
		<td align="center" style="font-family:verdana; font-size:15px"><B>GPMS Online Complaint Monitoring System <BR> Your Complaint / Requirement List</B></td>
	</tr>
	<tr align="justify">
		<td align="center" style="font-family:verdana; font-size:15px">
			<fieldset style="width:78%">
				<legend>Advanced Search</legend>
				<table border="1" width="100%" cellpadding="8" align="center" cellspacing="5" bgcolor="" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR}" valign="top">
					<tr bgcolor="#D1A4FF">
						<td>Complaint No.
							<input type="text" name="icomplaintno" value="{ICOMPLAINTNO}" style="font-family:verdana; font-size:15px; width:150px" id="ComplaintNo">
						</td>
						<td>Complaint Raised Date
							From : <input type="text" name="ifrom" value="{IFROM}" style="font-family:verdana; width:70px" id="from">
							To : <input type="text" name="ito" value="{ITO}" style="font-family:verdana; width:70px" id="to">
						</td>
						<td>Status
							<select name="istatus" style="font-family:verdana; font-size:15px; width:150px">{STATUSOPTION}</select>
						</td>
						<td>
							<input type="Submit" name="Search" value="Search" style="font-family:verdana; font-size:15px; width:80px; height:30px">
						</td>
					</tr>
				</table>
			</fieldset>
		</td>
	</tr>	
	<tr valign="top">
		<td colspan="2" align="center" valign="top">
			<table class="mGrid" border="0" width="80%" cellpadding="8" align="center" cellspacing="5" bgcolor="" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR}" valign="top">
				<tr class="alt">
					<td width="20%" style="font-family:verdana; font-size:12px; color:red">Complaints Un-Resolved : {COMPLAINTSUNRESOLVED}</td>					
					<td width="20%" style="font-family:verdana; font-size:12px; color:orange">Complaints In progress : {COMPLAINTSINPROGRESS}</td>
					<td width="20%" style="font-family:verdana; font-size:12px; color:green">Complaints Resolved : {COMPLAINTSRESOLVED}</td>
					<td width="20%" style="font-family:verdana; font-size:12px; color:black">Total Complaints : {COMPLAINTSTOTAL}</td>
				</tr>
			</table>
			<table class="mGrid" border="1" width="80%" cellpadding="8" align="center" cellspacing="5" bgcolor="" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR}" valign="top">				
				<tr align="center" valign="top">
					<th scope="col" width="05%">S.&nbsp;No.</th>
					<th scope="col" width="10%">Complaint No.</th>
					<th scope="col" width="10%">Date</th>
					<th scope="col" width="25%">Subject</th>												
					<th scope="col" width="10%">Status</th>
					<th scope="col" width="10%">Comment</th>
				</tr>
				<!-- BEGIN dbvalues -->
				<tr class="alt">
					<td align="right">
						{recno:parent.STARTNO,ROWCOUNT}
					</td> 
					<td align="center">
						{COMPLAINTNO}
					</td>
					<td align="left">
						{RAISEDDATE}
					</td>
					<td align="justify">
						{SUBJECT}
					</td> 												 
					<td align="left">
						<!-- IF STATUS = "Un-Resolved" --><FONT COLOR="red">{STATUS}</FONT><!-- ENDIF -->
						<!-- IF STATUS = "Resolved" --><FONT COLOR="green">{STATUS}</FONT><!-- ENDIF -->
						<!-- IF STATUS = "In progress" --><blink><FONT COLOR="#FF8040">{STATUS}</FONT></blink><!-- ENDIF -->
					</td>
					<td align="left">
						<a href="?module=helpdeskpublic&action=comments&rcid={RCID}"><font color="blue">View Comment</font></a>
					</td>
				</tr>
				<!-- END dbvalues -->
			</table>
		</td>
	</tr>		
</table>




<input type="hidden" name="rcid" value="{RCID}"/>	
<input type="hidden" name="action" value="{FORMACTION}"/>
<input type="hidden" name="module" value="{MODULE}"/>

<SCRIPT LANGUAGE="JavaScript">
	/*Javascript function for multiple datepicker starts here*/
	$(function() {
		var dates = $( "#from, #to" ).datepicker({
			defaultDate: "+1w",
			changeMonth: true,
			numberOfMonths: 3,
			onSelect: function( selectedDate ) {
				var option = this.id == "from" ? "minDate" : "maxDate",
					instance = $( this ).data( "datepicker" ),
					date = $.datepicker.parseDate(
						instance.settings.dateFormat ||
						$.datepicker._defaults.dateFormat,
						selectedDate, instance.settings );
				dates.not( this ).datepicker( "option", option, date );
			}
		});
	});
	/*Javascript function for multiple datepicker Ends here*/
</script>
<!-- Javascript function for Autocomplete Starts here  -->	
<script type="text/javascript">
$().ready(function() {
	$("#ComplaintNo").autocomplete("includes/helpdeskpublic/autoCompleteComplaintNo.php", {
		width: 260,
		matchContains: true,
		//mustMatch: true,
		//minChars: 0,
		//multiple: true,
		//highlight: false,
		//multipleSeparator: ",",
		selectFirst: false
	});
});
</script>	 
<!-- Javascript function for Autocomplete Ends here  -->	
<style type="text/css">
	p.big {line-height:140%;}

	fieldset {
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
		border-color:#008FD5;
	}

	-legend {
		-background: #C0C0C0;
		border: solid 1px #008FD5;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		padding: 2px;
	}
</style>